.headBox{
	position: relative;
	.icon{
		width: 0.44rem;
		height: 0.44rem;
		position: absolute;
		z-index: 200;
	}
	.dingwei{
		.icon();
		top: 0.22rem;
		left: 0.23rem;
	}
	.city{
		position: absolute;
		font-size: 0.28rem;
		top: 0.23rem;
		left: 0.72rem;
		color: #FFFFFF;
		z-index: 200;
	}
	.fenlei{
		.icon();
		left: 6.27rem;
		top: 0.22rem;
	}
	.vedio{
		.icon();
		left: 6.82rem;
		top: 0.22rem;
	}
	.inputBox{
		position: absolute;
		width: 4.4rem;
		height: 0.6rem;
		background: rgba(97,163,225);
		border-radius: 0.3rem;
		left: 1.62rem;
		top: 0.14rem;
		display: flex;
		z-index: 200;
		.search_img{
			width: 0.36rem;
			height: 0.36rem;
			margin: 0.13rem 0.12rem 0 0.24rem;
			line-height: 0.36rem;
		}
		.search_ipt{
			border: none;
			color: #FFFFFF;
			width: 3rem;
			background: rgba(97,163,225);
			outline:none
		}
	}
	
}

.contentBox{
	background-color: white;
	position: relative;
	top: -0.5rem;
	z-index: 50;
	padding-top: 0.27rem;
	border-radius: 0.2rem 0.2rem 0 0;
	.fenleiBox{
		margin-top: 0.53rem;
		margin-left: 0.3rem;
		margin-right: 0.3rem;
		.fenleiUl{
			display: flex;
			justify-content: space-between;
			.fenleiLi{
				text-align: center;
				img{
					width: 0.6rem;
					height: 0.6rem;
				}
				p{
					font-size: 0.24rem;
				}
			}
		}
	}
	.hotBox{
		margin: 0.55rem 0.3rem 0 0.3rem;
		box-shadow: 0px 10px 20px rgba(112, 144, 176, 0.1);
		border-radius: 0.2rem;
		.head{
			display: flex;
			margin: 0.21rem 0 0 0.3rem;
			position: relative;
			.leftBox{
				.hotText{
					font-size: 0.32rem;
					font-weight: 500;
					color: #1E2023;
				}
				.one{
					display: inline-block;
					width: 0.08rem;
					height: 0.32rem;
					background: #60A7F6;
					border-radius: 0.04rem;
					margin-left: 0.08rem;
					margin-top: 0.09rem;
				}
				.two{
					display: inline-block;
					width: 0.08rem;
					height: 0.24rem;
					background: #60A7F6;
					border-radius: 0.04rem;
					
					margin-top: 0.17rem;
				}
				.three{
					display: inline-block;
					width: 0.08rem;
					height: 0.16rem;
					background: #60A7F6;
					border-radius: 0.04rem;
					
					margin-top: 0.23rem;
				}
				p{
					font-size: 0.24rem;
					color: #8A93A1;
					opacity: 1;
				}
			}
			.newBox{
				position: absolute;
				right: 0;
				top: 0.26rem;
				display: flex;
				img{
					width: 0.36rem;
					height: 0.36rem;
					margin-right: 0.01rem;
				}
				span{
					font-size: 0.24rem;
					color: #AFBBCC;
					
				}
			}
		}
		
		.hotcontent{
			margin: 0.25rem 0.3rem 0 0.3rem;
			.hotUl{
				display: flex;
				justify-content: space-between;
				.hotLi{
					img{
						width: 1.98rem;
						height: 2.73rem;
					}
					.text{
						font-size: 0.24rem;
						color: #1E2023;
					}
					.num{
						font-size: 0.18rem;
						color: #8A93A1;
					}
				}
			}
		}
	
	}
	
	.lingganBox{
		margin: 0.72rem 0.3rem 0 0.3rem;
		.head{
			display: flex;
			justify-content: space-between;
			.leftBox{
				display: flex;
				
				.line{
					width: 0.08rem;
					height: 0.4rem;
					background: #60A7F6;
					border-radius: 0.04rem;
					display: inline-block;
					margin-top: 0.05rem;
				}
				.title{
					font-size: 0.36rem;
					font-weight: 500;
					color: #1E2023;
					margin-left: 0.08rem;
				}
			}
			.rightBox{
				display: flex;
				
				.more{
					font-size: 0.24rem;
					color: #60A7F6;
					opacity: 1;
					margin: 0.09rem 0 0 2.86rem;
				}
				img{
					width: 0.32rem;
					height: 0.32rem;
					margin: 0.12rem 0 0 0.02rem,;
				}
			}
			
		}
		.lgContent{
			margin-top: 0.24rem;
			.lgUl::-webkit-scrollbar {display:none}
			.lgUl{
				display: flex;
				overflow-x: scroll;
				white-space:nowrap; 
				.lgLi{
					margin-right: 0.18rem;
					img{
						width: 6.4rem;
						height: 3.6rem;
					}
					.title{
						font-size: 0.28rem;
						color: #1E2023;
					}
					.text{
						font-size: 0.24rem;
						color: #8A93A1;
						text-overflow: ellipsis;
					}
				}
			}
		}
		.banner{
			margin-top:0.41rem ;
			img{
				width: 6.9rem;
				height:3.46rem ;
			}
		}
	}
	.pictureBox{
		margin: 0.72rem 0.3rem 0 0.3rem;
		.head{
			display: flex;
			justify-content: space-between;
			.leftBox{
				display: flex;
				.line{
					width: 0.08rem;
					height: 0.4rem;
					background: #60A7F6;
					border-radius: 0.04rem;
					display: inline-block;
					margin-top: 0.05rem;
				}
				.title{
					font-size: 0.36rem;
					font-weight: 500;
					color: #1E2023;
					margin-left: 0.08rem;
				}
			}
			.rightBox{
				display: flex;
				.more{
					font-size: 0.24rem;
					color: #60A7F6;
					opacity: 1;
					margin: 0.09rem 0 0 2.86rem;
				}
				img{
					width: 0.32rem;
					height: 0.32rem;
					margin: 0.12rem 0 0 0.02rem,;
				}
			}
		}
		.pictureContent{
			margin-top: 0.24rem;
			.pictureUl{
				display: flex;
				flex-wrap: wrap;
				justify-content: space-between;
				.pictureLi{
					position: relative;
					margin-bottom: 0.3rem;
					img{
						width: 3.36rem;
						height: 3.36rem;
					}
					.title{
						font-size: 0.24rem;
						color: #1E2023;
						margin-top: 0.2rem;
					}
					.first{
						display: inline-block;
						font-size: 0.18rem;
						color: #60A7F6;
						padding: 0.02rem 0.1rem;
						border: 0.01rem solid #60A7F6;
						border-radius: 0.08rem;
						margin-top: 0.08rem;
					}
					.second{
						display: inline-block;
						font-size: 0.18rem;
						color: #FF9B38;
						padding: 0.02rem 0.1rem;
						border: 0.01rem solid #FF9B38;
						border-radius: 0.08rem;
						margin: 0.08rem 0 0 0.08rem;
					}
					.img_In{
						background-image: url(../img/home_icon_number%20of%20images.png);
						width: 0.28rem;
						height: 0.28rem;
						background-position: center;
						background-size: cover;
						background-repeat: no-repeat;
						position: absolute;
						top: 2.99rem;
						right: 0.29rem;
					}
					.img_num{
						position: absolute;
						font-size: 0.2rem;
						color: #FFFFFF;
						top: 2.99rem;
						right: 0.07rem;
					}
				}
			}
		}
	}
}
